<template>
    <eui-popup ref="gdsPopup" background-color="#fff" type="bottom" :mask-click="false">
        <view class="popup-content">
            <view class="popup-title flex just-between">
                <view style="font-weight: bold;">
                    拣货
                </view>
                <bcm-close-btn @click="close" />
            </view>
            <scroll-view scroll-y="true" style="height: 70vh;padding: 20rpx 36rpx 0 30rpx;">
                <view>
                    <view style="box-sizing: border-box;margin-bottom: 15rpx;" class="text-left"
                        v-for="(item, index) in scope.bcmOrderGoodsList" :key="index">
                        <view style="line-height: 40rpx">{{ item.goodsName }}</view>
                        <view style="line-height: 40rpx">{{ item.goodsCode + '-' +
        item.goodsBarcode }}</view>
                        <view class="flex" style="line-height: 40rpx">
                            <view class="co-9e">购买数量:<text class='bold co-00' style="font-size: 36rpx">{{ item.goodsNum
                                    }}</text></view>
                            <view class="co-9e" style="margin-left: 30rpx;" v-if="!!item.refundGoodsNum">退货数量:<text
                                    style="color: chocolate;font-size: 36rpx" class='bold'>{{
        item.refundGoodsNum }}</text></view>
                            <view class="co-9e" style="margin-left: 30rpx;" v-if="!!item.refundGoodsNum">应拣数量:<text
                                    style="color: chocolate;font-size: 36rpx" class='bold'>{{
        item.pickQuantity }}</text></view>
                        </view>
                    </view>
                </view>
            </scroll-view>
            <view class="bottom-1">
                <eui-button type="max2" title="缺货拣货" style="width: 45%;" singleTag="exchange" @buttonClick="buttonClick"
                    v-show="(!!scope.refundOperateType && (scope.refundOperateType.includes('6')))" />
                <eui-button type="max" title="拣货完成" style="width: 45%;" singleTag="submit7" @buttonClick="buttonClick"/>
            </view>
        </view>
    </eui-popup>
</template>
<script>
import BcmCloseBtn from '../../components/BcmCloseBtn.vue';
import { getBcmUrl, bcmRequest } from '../../../../hooks/bcmServices';
export default {
	name: "OrderPickPopup",
	props: {
		scope: {
			type: Object,
			default: {}
		},
		show: {
			type: Boolean,
			default: false
		},
	},
	components: {
		BcmCloseBtn
	},
	watch: {
		show: {
			handler(val) {
				if (val) {
					this.$refs.gdsPopup.open('bottom');
				} else {
					this.close()
				}
			},
		}
	},
	data() {
		return {

		}
	},
	methods: {
		close() {
			this.$refs.gdsPopup.close();
			this.$emit('close');
		},
		getBcmUrl,
        getAll: async (orderId, refundOperateType) => {
			let list = [],params = {
					orderId,
					refundOperateType
				};
			let bcmUrl = getBcmUrl()
			const response = await bcmRequest(bcmUrl.orderApi, '订单表', 'PreCalculateRefund', params);
			if (!response.HasException) {
				if (response?.bcmOrderGoodsList?.length > 0 && response?.bcmOrder?.refundOperateType?.length !=
					0) {
					response?.bcmOrderGoodsList?.map((v) => {
						if (response?.bcmOrder?.refundOperateType.includes('6') && refundOperateType ==
							'6') {
							list.push(v)
						}
					})
				}
			} else {
				list = []
			}
			return list
		},
        buttonClick(t){
            const {singleTag} = t;
            switch(singleTag){
                case 'exchange':
                    this.getAll(this.scope.orderId, ['6']).then((data) => {
                        if (data.length != 0) {
                            uni.navigateTo({
                                url: '/pages/BcmViews/PickingOrder/goodsExchange?orderId=' + this.scope.orderId
                            })
                            setTimeout(()=> {
                                this.close()
                            },500)
                        } else {
                            uni.showToast({
                                duration: 3500,
                                icon: 'none',
                                title: `当前订单[${this.scope.thirdOrderNo}]无可操作的商品`
                            });
                        }
                    })
				    break;   
                case 'submit7':
                    this.pickingComplete()
                    break; 
            }
        },
        pickingComplete() {
			uni.showModal({
				title: '确定完成拣货吗?',
				content: '',
				showCancel: true,
				success: (res) => {
					if (res.confirm) {
						this.$emit('orderAction',{
							uniqueKey: '订单表',
							methodName: 'pickingComplete'
						}, this.scope, {}, '拣货操作成功', true)
					} else { }
				}
			});
		},
	}
}
</script>
<style lang="scss" scoped>
@import "@/static/font/enjoyicon/iconfont.css";
@import "../../common/common.css";
.popup-content {
  display: flex;
  flex-direction: column;
  width: 100%;
  padding: 0;
  background-color: #fff;

  .popup-title {
    display: flex;
    align-items: center;
    box-sizing: border-box;
    width: 100%;
    height: 100rpx;
    padding-right: 36rpx;
    padding-left: 30rpx;
    font-size: 33rpx;
    line-height: 100rpx;
    border-bottom: 1rpx solid #f1f1f1;
  }
}

.bottom-1 {
  display: flex;
  justify-content: center;
  flex: 0 0 auto;
  height: 70rpx;
  padding: $uni-spacing-col-sm * 2 $uni-spacing-row-sm;
  background: $uni-bg-color;
  // border-top: 1rpx solid #979797;
}
</style>
